<!--头像组件-->
<template>
    <div class="people-info">
      <div class="people-pic pic-myself">
      </div>
      <div class="people-status">组</div>
    </div>
</template>

<script setup>

</script>

<style scoped>

.people-remark{
  width:60rem;
  height:30rem;
  /*background-color: yellow;*/
  margin: 0 auto;
  margin-left: 2rem;
  margin-top:2rem;
  position: relative;
}

.people-info{
  width:5rem;
  height:5rem;
  /*background-color: green;*/
  position: relative;
}
.people-pic{
  width:4.5rem;
  height:4.5rem;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.people-status{
  width:1.5rem;
  height:1.5rem;
  border-radius: 50%;
  background-color: rgba(156, 0, 0, 1);
  color:rgba(255, 255, 255, 1);
  font-size: 0.8rem;
  font-weight: 700;
  text-align: right;
  line-height: 1.3rem;
  position: absolute;
  /*letter-spacing: 5px;*/
  bottom: 7%;
  right:7%;
  border: 1.5px solid white;
}

.people-id{
  font-size: 1.3rem;
  color:rgba(156, 0, 0, 1);
  font-weight: 700;
  font-family: 黑体;
  position: absolute;
  top:1rem;
  left:10%;
}
.people-identity{
  width:5.5rem;
  height:1.8rem;
  position: absolute;
  top:0.8rem;
  left:22%;
  background-color:rgba(156, 0, 0, 1);
  font-size: 8.5px;
  line-height: 1.8rem;
  font-weight: bold;
  border-radius:50px;
  text-align: center;
  /*font-family: "思源黑体";*/
  color:rgb(250,250,250);
}
</style>
